<template>
  <!-- 添加或修改盘点计划对话框 -->
  <el-dialog :title="title" v-if="open" v-model="open" width="650px" append-to-body>
    <el-form ref="form" label-width="90px" :inline="false" :model="form" :rules="rules" class="" v-loading="loading">
      <el-row :gutter="40">
        <el-col :span="12" :offset="0">

          <el-form-item label="输入搜索:" prop="brandName">
            <el-input v-model="form.brandName" placeholder="商品编号/商品货号"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12" :offset="0">

          <el-form-item label="商品名称:" prop="storeName">
            <el-input v-model="form.storeName" placeholder="店铺名称"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12" :offset="0">

          <el-form-item label="收货人:" prop="sort">
            <el-input v-model="form.sort" placeholder="收货人姓名/手机号"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12" :offset="0">

          <el-form-item label="物流单号:" prop="peisongNo">
            <el-input v-model="form.peisongNo" placeholder="物流单号"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12" :offset="0">
          <el-form-item label="订单状态:" prop="orderState">

            <el-select clearable style="width: 100%;" v-model="form.orderState" placeholder="请选择">
              <el-option v-for="item in status" :key="item.warehouseCode" :label="item.label"
                :value="+item.value"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <!-- <el-col :span="12" :offset="0">
          <el-form-item label="订单分类:" prop="brandStatus">
            
                    <el-select style="width: 100%;" v-model="form.supplyMode" placeholder="请选择">
                        <el-option v-for="item in warehouseList" :key="item.warehouseCode" :label="item.warehouseName"
                            :value="item.warehouseCode"></el-option>
                    </el-select>
          </el-form-item>
        </el-col> -->
        <el-col :span="12" :offset="0">
          <el-form-item label="订单来源:" prop="orderSource">

            <el-select clearable style="width: 100%;" v-model="form.orderSource" placeholder="请选择">
              <el-option v-for="item in source" :key="item.value" :label="item.label"
                :value="item.value + ''"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="24" :offset="0">
          <el-form-item label="下单时间:" prop="brandStatus">
            <el-date-picker clearable v-model="dateRange" style="width: 100%" value-format="YYYY-MM-DD" type="daterange"
              range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期" placeholder="选择提交时间"></el-date-picker>
          </el-form-item>
        </el-col>
      </el-row>

    </el-form>

    <template #footer>
      <div class="dialog-footer">
        <el-button @click="cancel">取 消</el-button>
        <el-button type="info" @click="reset">重置</el-button>
        <el-button type="primary" @click="submitForm">确定</el-button>
      </div>
    </template>
  </el-dialog>
</template>

<script>
import modelMixin from '@/mixins/modelMixin'
export default {
  name: "searchForm",
  mixins: [modelMixin],
  props: {
    status: {
      type: Array,
      default: () => []
    },
    source: {
      type: Array,
      default: () => []
    },
  },
  data() {
    return {
      open: false,
      title: "高级搜索",
      form: {},
      rules: {},
      dateRange: []
    }
  },
  created() {
  },
  watch: {
    query(newValue, oldValue) {
      console.log('newValue :>> ', newValue);
      this.form = newValue

    }
  },
  methods: {
    cancel() {
      this.open = false;
    },
    show(query, dateRange) {
      this.dateRange = dateRange
      this.form = query
      this.open = true;
    },
    submitForm() {
      console.log(this.form, 'this.form')
      this.$emit('search', this.form, this.dateRange)
      this.open = false;
    },
    reset() {
      this.form = {
        brandName: '',
        sort: '',
        peisongNo: '',
        orderState: '',
        orderSource: '',
        pageNum: 1,
        pageSize: 20
      }
      this.submitForm()
    }
  }
}
</script>

<style lang="scss" scoped></style>